<template>
	<view>
		<view style="padding-left: 50rpx;">
			<image class="title"
				src="https://youzhen.sdshengyue.cn/uploads/attach/2023/09/20230926/6bb41a1f9e5bbdbcd7be6c5690f20c25.png"
				mode="aspectFit"></image>
			<view class="time" style="padding-left: 60rpx;">{{formatDate(info.start_time).substring(11,17)}} <span style="margin-left: 100rpx;">{{formatDate(info.start_time).substring(0,10)}}</span></view>
			<view class="address">
				<image style="" mode="aspectFit"
					src="https://youzhen.sdshengyue.cn/uploads/attach/2023/09/20230927/c2b481e7b096c3f9f9397683bafd29f3.png">
				</image>
				品鉴地址：{{info.address}}
			</view>
		</view>

		<image mode="aspectFit" class="tips"
			src="https://youzhen.sdshengyue.cn/uploads/attach/2023/09/20230927/ec3dd3ec1de573689e0c06309de4ac48.png">
		</image>
		<view class="tips_detail">{{info.synopsis}}</view>
		<image class="people_info" mode="aspectFit"
			src="https://youzhen.sdshengyue.cn/uploads/attach/2023/09/20230927/9c0ad7394b876b968700589bdd21caf7.png">
		</image>
		<input class="input" type="text" v-model="name" placeholder="请输入您的姓名">
		<input class="input" type="text" v-model="phone" placeholder="请输入您的联系电话">
		<view class="btn" @click="submit()">提交</view>
		<view @click="back" style="width: 100%;text-align: center;color: #fff;font-size: 28rpx;margin-top: 20rpx;">返回
		</view>
	</view>
</template>
<!-- https://youzhen.sdshengyue.cn/ -->
<script>
	import {
		getDeatil,
		addInfo
	} from '@/api/activity.js';
	export default {
		data() {
			return {
				id:'',
				info:'',
				name:'',
				user_id:'',
				phone:''
			};
		},
		methods: {
			back() {
				uni.navigateBack()
			},
			getInfo(){
				getDeatil({id:this.id}).then( res =>{
					this.info = res.data
				})
			},
			formatDate(value) {
				let date = new Date(value * 1000);
				let y = date.getFullYear();
				let MM = date.getMonth() + 1;
				MM = MM < 10 ? ('0' + MM) : MM;
				let d = date.getDate();
				d = d < 10 ? ('0' + d) : d;
				let h = date.getHours();
				h = h < 10 ? ('0' + h) : h;
				let m = date.getMinutes();
				m = m < 10 ? ('0' + m) : m;
				return y + '-' + MM + '-' + d + ' ' + h + ':' + m;
			},
			submit(){
				const reg = /^((13[0-9])|(14[0-9])|(15[0-9])|(16[0-9])|(17[0-9])|(18[0-9])|(19[0-9]))\d{8}$/
				if (!reg.test(this.phone)) {
				    uni.showToast({
				        icon: 'none',
				        title: '请输入正确的11位手机号'
				    })
				    this.phone = ''
				    return false
				}
				addInfo({
					a_id:this.id,
					user_id:this.user_id,
					name:this.name,
					phone:this.phone
				}).then( res =>{
					console.log(res.msg);
					uni.showToast({
						title:res.msg,
						icon:'none'
					})
					setTimeout(() =>{
						uni.reLaunch({
							url:'/pages/newAdd/article/article'
						})
					},1000)
				})
			}
		},
		onLoad(options){
			this.id = options.id
			this.getInfo()
			this.user_id = uni.getStorageSync('UID');
		}
	}
</script>

<style lang="scss">
	page {
		background-image: url('https://youzhen.sdshengyue.cn/uploads/attach/2023/09/20230926/c2b556b17898e9dc063cdfd296c2d981.png');
		background-size: 100% 100%;
	}

	.input {
		background-color: #F6F6F6;
		width: 80%;
		margin-left: 10%;
		height: 100rpx;
		line-height: 100rpx;
		opacity: 0.3;
		border-radius: 50rpx;
		font-size: 32rpx;
		padding-left: 20rpx;
		margin-top: 30rpx;
	}

	.people_info {
		width: 60%;
		margin-left: 50rpx;
		height: 100rpx;
		margin-top: 50rpx;
	}

	.btn {
		margin-top: 40rpx;
		width: 80%;
		margin-left: 10%;
		height: 80rpx;
		line-height: 80rpx;
		text-align: center;
		background: linear-gradient(90deg, #F7E3B2, #D6A35B);
		border-radius: 50rpx;
		font-size: 36rpx;
		font-weight: bold;
		color: #140F10;
	}

	.title {
		width: 70%;
		height: 100rpx;
		margin-top: 200rpx;
	}

	.tips {
		width: 80%;
		height: 100rpx;
		margin-left: 10%;
		margin-top: 60rpx;
	}

	.tips_detail {
		width: 90%;
		margin-left: 5%;
		// margin-top: 20rpx;
		color: #E8CEA4;
		line-height: 50rpx;
	}

	.time {
		width: 67%;
		height: 70rpx;
		line-height: 70rpx;
		color: #E8CEA4;
		font-size: 30rpx;
		background-image: url('https://youzhen.sdshengyue.cn/uploads/attach/2023/09/20230927/b2eb0009e2904782da848f816fcdbacc.png');
		background-size: 100% 100%;

		padding-left: 20rpx;
	}

	.address {
		margin-top: 20rpx;
		width: 100%;
		height: 60rpx;
		line-height: 60rpx;
		color: #E8CEA4;
		font-size: 26rpx;

		image {
			width: 30rpx;
			height: 30rpx;
			vertical-align: middle;
			margin-right: 10rpx;
		}
	}
</style>